<template>
  <!-- 用户详情 首页 -->

  <el-row :gutter="20">
    <!-- 基础信息 -->
    <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">用户名: </div><div class="info_detail_value">{{ userInfo.username || '-' }}</div></el-col>
    <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">手机号: </div><div class="info_detail_value">{{ userInfo.mobile || '-' }}</div></el-col>
    <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">邮箱: </div><div class="info_detail_value">{{ userInfo.email || '-' }}</div></el-col>
    <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">昵称: </div><div class="info_detail_value">{{ userInfo.nickname || '-' }}</div></el-col>
    <!-- user info-->
    <div v-if="userInfo.userInfo">

      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">姓名: </div><div class="info_detail_value">{{ userInfo.userInfo.name || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">身份证号: </div><div class="info_detail_value">{{ userInfo.userInfo.idCardNo || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">护照号: </div><div class="info_detail_value">{{ userInfo.userInfo.passportNo || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">联系电话: </div><div class="info_detail_value">{{ userInfo.userInfo.linkPhone || '-' }}</div></el-col>
      <!-- 1：男 2：女 0：不详 -->
      <!-- 智能推断为字典类型, 字典类型为 dict.sys_user_info_sex -->
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">性别: </div><div class="info_detail_value">{{ dict.label.sex[userInfo.userInfo.sex] || '未知字典码:'+userInfo.sex }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">省id: </div><div class="info_detail_value">{{ userInfo.userInfo.provinceId || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">市id: </div><div class="info_detail_value">{{ userInfo.userInfo.cityId || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">县id: </div><div class="info_detail_value">{{ userInfo.userInfo.countyId || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">街道: </div><div class="info_detail_value">{{ userInfo.userInfo.countyName || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">详细地址: </div><div class="info_detail_value">{{ userInfo.userInfo.address || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">qq号: </div><div class="info_detail_value">{{ userInfo.userInfo.qqNo || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">微信号: </div><div class="info_detail_value">{{ userInfo.userInfo.weixiNo || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">头像: </div><div class="info_detail_value">{{ userInfo.userInfo.avatar || '-' }}</div></el-col>
      <el-col :xs="24" :sm="12" :md="8"><div class="info_detail_name">备注: </div><div class="info_detail_value">{{ userInfo.userInfo.remark || '-' }}</div></el-col>
    </div>
  </el-row>

</template>

<script>
// 用户详情 - model
import { defaultInfo } from '@/views/sys/User/info'
export default {
  dicts: [
    'sex'
  ], // 字典
  props: {
    userInfo: {
      type: Object,
      default: () => { return defaultInfo }
    }
  },
  data() {
    return {

    }
  },
  mounted() {
  },
  methods: {
  }
}
</script>

<style lang="scss" scoped>

</style>
